import React, { useState } from 'react';

const Parent = () => {
  const [parent, setParent] = useState(0);

  // 事件处理函数
  const handleCount = () => {
    setParent(parent + 1);
  };

  return (
    <div>
      <h2>Parent-{parent}</h2>
      <div>{(() => console.log('render'))()}</div>
      <button onClick={handleCount}>+1</button>
      <hr />
      {/* <Child parent={parent}></Child> */}
    </div>
  );
};

const Child = (props) => {
  console.log('前前');
  console.log(props.parent);
  const [child, setChild] = useState(props.parent);
  console.log(props.parent);
  console.log('后后');

  return (
    <div>
      <h3>Child</h3>
      <h3>state-{child}</h3>
      <h3>props-{props.parent}</h3>
    </div>
  );
};

export default Parent;
